13996527831
详细

如何做好网页切图?

发表日期:2015-04-12 19:18:26   作者来源:米卓网络   浏览:    

  什么是网页切片?网页切片可以使用切片将源图像分成许多的功能区域。将图像存为Web页时,每个切片作为一个独立的文件存储,文件中包含切片自己的设置、颜色调板、链接、翻转效果及动画效果。可以使用切片加快下载速度。

  网页切片是网页设计人员必备技能之一,但是并不是人人都能做好网页切片。把一个psd文档要切成网页需要繁琐的工序,新手很难掌握这些技巧。重庆网站建设公司分享一些切片的基本要求:

  1、颜色范围

  如果一个区域中颜色范围小,只有几种颜色,那么应该单独切出;如果只有一种颜色,切片后选择HTML类型,在DW中改背景颜色就可以了。如果颜色数量比较多,渐变过渡多一些,应该把切片数量切的多一些;色块用HTML代替渐变,用png来生成。颜色单一过渡,可以用用GIF或PNG生成。不可把图切的太细,也就是不要生成太多小图。

  2、切片大小

  切片的目的主要是加快下载进度,所以切片大小要根据需要来切,标志LOGO等主要部分尽量切在一个切片内,防止显示遇到特殊情况时显示一部分,圆角表格部分要根据显示区域的大小来切,控制好边缘和边角,并且需要在DW中编辑。

  3、切片区域

  保证完整的一部分在一个切片内,例如某区域的标题文字,以后修改时方便。

  4、导出类型

  颜色单一过渡少的,应该导出为GIF,颜色过渡比较多,颜色丰富的应该导出为JPG,有动画的部分应该导出为GIF动画。

  5、源文件存档

  即使页面作好了,也要保留带切片层的源文件,在需要修改的时候,直接修改单独导出所用的切片。

  切片要注意的常见问题:

  1、切片是生成表格的依据,切片的过程要先总体后局部,即先把网页整体切分成几个大部分,再细切其中的小部分。

  2、对于渐变的效果或圆角等图片特殊效果,需要在页面中表现出来的,要单独切出来

  3、在DW中进行编辑时,少用图片,如果能用背景颜色代替的就使用背景颜色 能使用图案的也尽可能使用图案平铺来形成背景

  4、在DW中进行编辑时,删除图片时出面表格错位如何办?

  删除图片的时候记住图片的长宽,再插入一个相同长宽的表格。

  5、在DW中如何自定义表格的长宽?

  使用表格长宽一样的图片做为单元格的背景。

  6、如何在图片上输入文字?

  把图片设置成背景。

  学会切片没有什么太多技巧。需要我们在不断的实验的过程中去总结,找到自己得心应手的方法,包括从用户体验和技术层面。这样做出来的网页才能达到用户使用最佳的浏览体验,具美观和舒适度,让用户喜欢、乐意使用。